<template>
	<view class="page">
		<view class="flex benben-position-layout flex flex-wrap align-center personalInformation_flex_0"
			:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class='flex flex-wrap align-center justify-between flex-sub personalInformation_fd0_0'>
				<view class='flex flex-wrap align-center' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
					<text class='fu-iconfont2  personalInformation_fd0_0_c0_c0' @tap.stop="handleJumpDiy"
						data-type="back" data-url="1">&#xE794;</text>
				</view>
				<text class='personalInformation_fd0_0_c1'>订单详情</text>
				<view class='flex flex-wrap align-center personalInformation_fd0_0_c2'>
				</view>
			</view>

		</view>
		<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
		<view class="loading_css" v-if="isShow">
			<u-loading size="36" color="#1A66FA"></u-loading>
			<view>加载中</view>
		</view>
		<template v-else>
			<view class="page_content">
				<view class="card_no flex align-center justify-between">
					<view class="card_no_text flex align-center">
						<text>{{detailsInfo.car_number}}</text>
						<image v-if="detailsInfo.from == 1" class="order_source" :src='STATIC_URL+"460.png"'
							mode="aspectFill"></image>
						<view class="housekeep flex align-center justify-center" v-if="detailsInfo.from == 2">
							<text class="housekeep_text">管家</text>
						</view>
						<image v-if="detailsInfo.from == 4" class="order_source" :src='STATIC_URL+"462.png"'
							mode="aspectFill"></image>
						<image v-if="detailsInfo.from == 5" class="order_source" style="width: 110rpx;"
							:src='STATIC_URL+"463.png"' mode="aspectFill"></image>
						<view class="housekeep_ks flex align-center justify-center" v-if="detailsInfo.from == 6">
							<text class="housekeep_text">快手</text>
						</view>
						<view class="housekeep_ota flex align-center justify-center" v-if="detailsInfo.from > 6">
							<text class="housekeep_text">{{otaName}}</text>
						</view>
						<image v-if="detailsInfo.risk == 1" class="order_source" :src='STATIC_URL+"494.png"'
							mode="aspectFill"></image>
						<!-- <view class="order_source_timeout flex align-center justify-center" v-if="detailsInfo.status == 3 && detailsInfo.repay_overtime == 1">
							<text class="order_source_timeout_text">超时</text>
						</view> -->
					</view>
					<view class="order_status" v-if="detailsInfo.status == 2">待发车</view>
					<view class="order_status" v-if="detailsInfo.status == 3">待收车</view>
					<view class="order_status" v-if="detailsInfo.status == 4">已完成</view>
					<view class="order_status" v-if="detailsInfo.status == 5">已取消</view>
					<view class="order_status" v-if="detailsInfo.status == 1">待付款</view>
				</view>
				<view class="label_info flex align-center justify-between">
					<view class="label_list">
						<!-- <view class="label_item flex align-center justify-center">{{detailsInfo.gearbox}}</view>
						<view class="label_item flex align-center justify-center">{{detailsInfo.category_name}}</view>
						<view class="label_item flex align-center justify-center">{{detailsInfo.power}}</view>
						<view class="label_item flex align-center justify-center">{{detailsInfo.model}}</view> -->
						<view class="label_item flex align-center justify-center">{{detailsInfo.name}}</view>

					</view>
					<view class="price_le flex align-center">
						<text class="price_le_1">总价：</text>
						<text class="price_le_2">¥</text>
						<text class="price_le_3">{{ Number(detailsInfo.money) }}</text>
						<!-- <text class="price_le_3">{{ detailsInfo.origin_money | frontPrice }}</text>
						<text class="price_le_4">{{ detailsInfo.origin_money | laterPrice }}</text> -->
					</view>
				</view>
				<view class="order_date flex align-center justify-between" @tap.stop="changeOrderTime">
					<view class="date_item">
						<view class="date_item_1">{{timeData.toDay_time}} {{timeData.week}}</view>
						<view class="date_item_2">{{timeData.toDay_month}}</view>
					</view>
					<view class="date_ce">
						<image class="date_ce_1" :src='STATIC_URL+"467.png"' mode="aspectFill"></image>
						<!-- <view class="date_ce_2">{{timeData.interval}}</view> -->
						<view class="date_ce_2">{{detailsInfo.lease_day_text}}</view>

					</view>
					<view class="date_item" style="text-align: right;">
						<view class="date_item_1">{{timeData.twoDay_time}} {{timeData.twoWeek}}</view>
						<view class="date_item_2">{{timeData.twoDay_month}}</view>
					</view>
				</view>
				<view class="reserve_info">
					<view class="reserve_item" @tap.stop="openLocationInfo">
						<text v-if="detailsInfo.door_to_door == 1">到店取车：</text>
						<text v-else>送车上门：</text>
						<text v-if="detailsInfo.door_to_door == 1">{{detailsInfo.store_name}}</text>
						<text v-else>{{detailsInfo.address}}</text>
					</view>
					<view class="reserve_item" style="margin-top: 14rpx;">
						<text>预定时间：</text>
						<text>{{detailsInfo.create_at}}</text>
					</view>
					<view class="reserve_item" style="margin-top: 14rpx;" v-if="detailsInfo.car_type == 1">
						<text>车辆所属门店：</text>
						<text>{{detailsInfo.car_store_name}}</text>
					</view>
					<view class="reserve_item" style="margin-top: 14rpx;">
						<text>订单编号：</text>
						<text>{{detailsInfo.sn}}</text>
						<text class="copy_text" @tap.stop="copyToClipboard(detailsInfo.sn)">复制</text>
					</view>
				</view>
				<!-- <view class="actual_time flex align-center justify-between">
					<view class="actual_item" style="text-align: left;">
						<view class="actual_item_1">{{detailsInfo.real_fc_time.slice(11, 16)}}</view>
						<view class="actual_item_2">{{detailsInfo.real_fc_time.slice(0, 10)}}</view>
					</view>
					<view class="date_ce">
						<view class="date_ce_2">实际取还</view>
					</view>
					<view class="actual_item" style="text-align: right;">
						<template v-if="detailsInfo.real_sc_time">
							<view class="actual_item_1">{{detailsInfo.real_sc_time.slice(11, 16)}}</view>
							<view class="actual_item_2">{{detailsInfo.real_sc_time.slice(0, 10)}}</view>
						</template>
						<template v-else>
							
						</template>
					</view>
				</view> -->
				<view class="order_date_status flex align-center justify-between" v-if="detailsInfo.real_fc_time">
					<view class="date_item_status" style="text-align: left;">
						<view class="date_item_status_1">{{detailsInfo.real_fc_time.slice(11, 16)}}</view>
						<view class="date_item_status_2">{{detailsInfo.real_fc_time.slice(0, 10)}}</view>
					</view>
					<view class="date_ce_status">
						<!-- <image class="date_ce_status_1" :src='STATIC_URL+"467.png"' mode="aspectFill"></image> -->
						<view class="date_ce_status_2">实际取还</view>
					</view>
					<template v-if="detailsInfo.real_sc_time">
						<view class="date_item_status" style="text-align: right;">
							<view class="date_item_status_1">{{detailsInfo.real_sc_time.slice(11, 16)}}</view>
							<view class="date_item_status_2">{{detailsInfo.real_sc_time.slice(0, 10)}}</view>
						</view>
					</template>
					<template v-else>
						<view class="no_cars" style="text-align: right;">
							暂未还车
						</view>
					</template>

				</view>
				<view class="content_bg">
					<view class="infor_item no_line flex align-center justify-between" @tap.stop="handleJumpDiy"
						data-type="navigateTo"
						:data-url="`/pages/my/personalInformation/personalInformation?user_id=${detailsInfo.user_id}`">
						<view class="infor_item_le flex align-center">
							<view class="">会员信息</view>
							<view @tap.stop="handleJumpDiy" data-type="navigateTo" :data-url="`/pages/order/changeUser`"
								class="infor_item_ri_5 flex align-center justify-center"
								v-if="detailsInfo.status == 1 || (detailsInfo.status == 2 && detailsInfo.contract == 0)">
								更换租客</view>
							<view class="user_order flex align-center justify-center" @tap.stop="handleJumpDiy"
								data-type="navigateTo"
								:data-url="`/pages/index/memberList/userOrder?user_id=${detailsInfo.user_id}`">
								<!-- <image :src='STATIC_URL+"496.png"' mode="aspectFill"></image> -->
								<text>历史订单</text>
							</view>
						</view>
						<view class="infor_item_ri_4">
							<text v-if="detailsInfo.is_auth == 0">待认证</text>
							<text v-if="detailsInfo.is_auth == 1">已认证</text>
							<u-icon name="arrow-right" size="24"></u-icon>
						</view>
					</view>
					<view class="id_card flex align-center">
						<text class="id_card_1">姓名：</text>
						<text class="id_card_2" v-if="detailsInfo.username">{{detailsInfo.username}}</text>
						<text class="id_card_2" v-else>暂无</text>
					</view>
					<view class="id_card flex align-center" style="margin-top: 16rpx;">
						<text class="id_card_1">身份证：</text>
						<text class="id_card_2" v-if="detailsInfo.id_card_no">{{detailsInfo.id_card_no}}</text>
						<text class="id_card_2" v-else>暂无</text>
					</view>
					<view class="member_phone flex justify-between">
						<view class="member_phone_1">
							<text class="member_phone_1_1">手机号：</text>
							<text class="member_phone_1_2">{{detailsInfo.phone_no}}</text>
						</view>
						<view class="member_phone_2 flex align-center justify-center"
							@tap.stop="getPhone(detailsInfo.phone_no)">拨打</view>
					</view>
				</view>
				<!-- <view class="content_bg" v-if="detailsInfo.real_fc_time">
					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le">实际发(收)车时间</view>
					</view>
					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le_1">发车时间：</view>
						<view class="infor_item_ri_1">{{detailsInfo.real_fc_time}}</view>
					</view>
					<view class="infor_item no_line flex align-center justify-between">
						<view class="infor_item_le_1">收车时间：</view>
						<view class="infor_item_ri_1" v-if="detailsInfo.real_sc_time">{{detailsInfo.real_sc_time}}</view>
						<view class="infor_item_ri_1" v-else>暂无</view>
					</view>
				</view> -->

				<view class="content_bg">
					<view class="infor_item flex align-center justify-between" @tap.stop="handleJumpDiy"
						data-type="navigateTo" :data-url="`/pages/my/myOrder/depositRecord?order_id=${order_id}`">
						<view class="infor_item_le flex align-center">
							<text>订单押金</text>
							<view class="flex align-center justify-center deposit_info"
								v-if="detailsInfo.is_freeze > 0">
								<image class="deposit_img" :src='STATIC_URL+"454.png"' mode="aspectFill"></image>
								<text>线上免押</text>
							</view>
						</view>
						<view class="infor_item_ri">
							<text v-if="detailsInfo.is_freeze == 0">未免押</text>
							<text v-if="detailsInfo.is_freeze == 1">已免押</text>
							<text v-if="detailsInfo.is_freeze == 2">已解冻</text>
							<u-icon name="arrow-right" size="24"></u-icon>
						</view>
					</view>
					<view class="infor_item no_line flex align-center justify-between">
						<view class="infor_item_le_1">租车押金</view>
						<view class="infor_item_ri_1">￥{{Number(detailsInfo.deposit)}}</view>
					</view>
					<view class="infor_item no_line flex align-center justify-end" style="padding: 0 0 24rpx;"
						v-if="detailsInfo.is_freeze == 1">
						<view class="infor_item_ri_5 flex align-center justify-center"
							@tap.stop="depositRefundShow=true">
							解冻押金
						</view>
					</view>
				</view>
				<view class="content_bg">
					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le">订单费用</view>
						<view class="flex align-center">
							<view class="infor_item_ri_6 flex align-center justify-center"
								v-if="detailsInfo.status == 2 && detailsInfo.coupon_type == 2 && userInfo.is_cat_fee == 1"
								@tap.stop="reissueShow=true">
								补发优惠券
							</view>
							<view v-if="detailsInfo.status == 1 || detailsInfo.status == 2 || detailsInfo.status == 3"
								class="infor_item_ri_2 flex align-center justify-center" @tap.stop="handleJumpDiy"
								data-type="navigateTo"
								:data-url="`/pages/order/changeCar?order_id=${order_id}&user_id=${detailsInfo.user_id}&store_id=${detailsInfo.store_id}&date1=${detailsInfo.take_at}&date2=${detailsInfo.repay_at}&form_car_id=${detailsInfo.real_car_id}&car_id=${detailsInfo.car_id}`">
								换车</view>
						</view>

					</view>
					<view class="infor_item flex align-center justify-between" v-for="(v, k) in other_order_pay_item"
						:key="k">
						<view class="infor_item_le_1" style="flex: 1;">{{v.name}}</view>
						<view class="infor_item_ri_1" style="min-width: 100rpx;text-align: right;">￥{{Number(v.price)}}
						</view>
					</view>
					<!-- <view class="infor_item flex align-center justify-between">
						<view class="infor_item_le_1">订单租金</view>
						<view class="infor_item_ri_1">￥{{Number(detailsInfo.rent_money)}}</view>
					</view>

					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le_1">
							基本保障服务费</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.insurance_money)}}</span>
						</view>
					</view>
					<view class="infor_item flex align-center justify-between" v-if="detailsInfo.insure_plus_id != 0">
						<view class="infor_item_le_1">{{upgrade_name}}</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.insure_plus_money)}}</span>
						</view>
					</view> -->
					<!-- <view class="infor_item flex align-center justify-between" v-if="detailsInfo.door_to_door == 2">
						<view class="infor_item_le_1">送车上门</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.call_out_charge)}}</span>
						</view>
					</view>
					
					<view class="infor_item flex align-center justify-between" v-if="Number(detailsInfo.xryhq_price)">
						<view class="infor_item_le_1">新人优惠</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.xryhq_price)}}</span>
						</view>
					</view>
					<view class="infor_item flex align-center justify-between" v-if="Number(detailsInfo.deduction)">
						<view class="infor_item_le_1">券抵扣</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.deduction)}}</span>
						</view>
					</view>
					<view class="infor_item flex align-center justify-between" v-if="detailsInfo.time_out_hours">
						<view class="infor_item_le_1">超时{{detailsInfo.time_out_hours}}小时</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.time_out_price)}}</span>
						</view>
					</view>
					<view class="infor_item flex align-center justify-between" v-if="detailsInfo.km_out_num">
						<view class="infor_item_le_1">行驶里程{{detailsInfo.km_out_num}}km</view>
						<view class="infor_item_ri_1">
							<span>￥{{Number(detailsInfo.km_out_price)}}</span>
						</view>
					</view> -->
					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le_1">订单总价</view>
						<view class="infor_item_ri_1">
							<text style="font-size: 26rpx;font-weight: 500;">￥</text>
							<text style="font-size: 36rpx;font-weight: 500;">{{Number(detailsInfo.money)}}</text>
						</view>
					</view>
					<view class="preferential no_line flex align-center justify-between">
						<view class="preferential_le">
							<!-- <text>已优惠：￥{{Number(detailsInfo.deduction) + Number(detailsInfo.xryhq_price)}}</text> -->
						</view>
						<view class="preferential_ri">
							<text
								v-if="detailsInfo.status == 2 || detailsInfo.status == 3 || detailsInfo.status == 4">已付：</text>
							<text v-else>应付：</text>
							<template
								v-if="detailsInfo.status == 2 || detailsInfo.status == 3 || detailsInfo.status == 4">
								<template v-if="detailsInfo.all_items_has_pay == 0">

									<text style="font-size: 26rpx;color: #FF532E;">￥</text>
									<text
										style="font-size: 36rpx;color: #FF532E;">{{roundNum(detailsInfo.money-detailsInfo.unpay_money, 2)}}</text>
								</template>
								<template v-else>
									<text style="font-size: 26rpx;color: #FF532E;">￥</text>
									<text style="font-size: 36rpx;color: #FF532E;">{{Number(detailsInfo.money)}}</text>
								</template>
							</template>
							<template v-else>
								<text style="font-size: 26rpx;">￥</text>
								<text style="font-size: 36rpx;">{{Number(detailsInfo.money)}}</text>
							</template>
							<template v-if="detailsInfo.all_items_has_pay == 0">
								<text style="margin-left: 12rpx;">待付：</text>
								<text style="font-size: 26rpx;">￥</text>
								<text style="font-size: 36rpx;">{{Number(detailsInfo.unpay_money)}}</text>
							</template>
						</view>
					</view>

					<view class="offline_view flex justify-end">

						<view v-if="detailsInfo.status == 1" class="offline_text flex align-center justify-center"
							@tap.stop="openCancel">取消订单</view>
						<view v-if="detailsInfo.status == 2" class="offline_text flex align-center justify-center"
							@tap.stop="refundOrder">取消订单</view>
						<view v-if="detailsInfo.status == 3" class="offline_text flex align-center justify-center"
							@tap.stop="goRenewal">续租</view>
						<view v-if="detailsInfo.status == 3 && relet.length > 0"
							class="offline_text flex align-center justify-center" @tap.stop="cancelRenewal">取消续租</view>
						<view v-if="detailsInfo.status == 2 || detailsInfo.status == 3 || detailsInfo.status == 4"
							class="offline_text flex align-center justify-center" @tap.stop="signContract">
							<text v-if="detailsInfo.contract == 0">签署合同</text>
							<text v-if="detailsInfo.contract == 1">签署合同</text>
							<text v-if="detailsInfo.contract == 2">查看合同</text>
						</view>
						<!-- <view v-if="detailsInfo.status != 4 && detailsInfo.status != 5"
							class="offline_text flex align-center justify-center" @tap.stop="postOfflinePay">
							<text>线下支付</text>
						</view> -->
						<view v-if="detailsInfo.status != 4 && detailsInfo.status != 5"
							class="offline_text flex align-center justify-center" @tap.stop="openXinyong">免押</view>
					</view>
				</view>
				<!-- <view class="content_bg" v-if="other_order_pay_item.length > 0">
					<view class="infor_item no_line flex align-center justify-between"
						@tap.stop="other_price_show = !other_price_show">
						<view class="infor_item_le">费用明细</view>
						<view class="infor_item_ri">
							<image v-if="!other_price_show" style="width: 28rpx;height: 28rpx;"
								:src='STATIC_URL+"279.png"' mode="aspectFill"></image>
							<image v-else style="width: 28rpx;height: 28rpx;" :src='STATIC_URL+"280.png"'
								mode="aspectFill"></image>
						</view>
					</view>
					<template v-if="other_price_show">
						<view style="height: 1px;background: #eee;"></view>
						<view class="infor_item flex align-center justify-between"
							v-for="(v, k) in other_order_pay_item" :key="k">
							<view class="infor_item_le_1">{{v.name}}</view>
							<view class="infor_item_ri_1">￥{{Number(v.price)}}</view>
						</view>
					</template>
				</view> -->
				<view class="content_bg" v-if="relet.length > 0">
					<view class="infor_item flex align-center justify-between">
						<view class="infor_item_le">续租信息</view>
						<!-- <view class="infor_item_ri">
							<text>记录</text>
							<u-icon name="arrow-right" size="24"></u-icon>
						</view> -->
					</view>
					<template v-for="(item, index) in relet">
						<view class="infor_item flex align-center justify-between">
							<view class="infor_item_le_1">续租开始时间</view>
							<view class="infor_item_ri_1">{{item.take_at}}</view>
						</view>
						<view class="infor_item no_line flex align-center justify-between">
							<view class="infor_item_le_1">续租结束时间</view>
							<view class="infor_item_ri_1">{{item.repay_at}}</view>
						</view>
					</template>
				</view>

				<view class="content_bg" v-if="groupon_info.length > 0">
					<view class="infor_item no_line flex align-center justify-between">
						<view class="infor_item_le" v-if="detailsInfo.coupon_type == 301">快手团购</view>
						<view class="infor_item_le" v-else>抖音团购</view>
					</view>
					<view class="coupon_item flex justify-between" v-for="(v, k) in groupon_info" :key="k">
						<view class="coupon_item_1" style="flex: 1;">
							<text style="margin-right: 8rpx;">￥{{v.price}}</text>
							<text>{{v.name}}</text>
						</view>
						<view class="coupon_item_2" style="width: 60rpx;text-align: right;">
							x{{v.use_num}}</view>
					</view>
				</view>

				<view class="remarks" @tap.stop="remarkShow=true">
					<view class="flex align-center justify-between">
						<view class="remarks_le">订单备注</view>
						<view class="remarks_ri">
							<text>填写备注</text>
							<u-icon name="arrow-right" size="24" color="#979797"></u-icon>
						</view>
					</view>
					<view class="flex" style="margin-top: 16rpx;" v-if="detailsInfo.remark">
						<view>备注内容：</view>
						<view style="flex: 1;">{{detailsInfo.remark}}</view>
					</view>
				</view>
				<view class="remarks flex align-center justify-between" v-if="detailsInfo.status == 5">
					<view class="remarks_le">订单变更</view>
					<view class="remarks_ri_1">
						<text>{{detailsInfo.cancel_tip}}</text>
					</view>
				</view>
				<view class="remarks flex align-center justify-between" v-if="detailsInfo.vio_status !== null">
					<view class="remarks_le">车辆违章</view>
					<view class="remarks_ri_1">
						<text v-if="detailsInfo.vio_status == 0">待处理</text>
						<text v-if="detailsInfo.vio_status == 1">处理中</text>
						<text v-if="detailsInfo.vio_status == 2">处理完成</text>
					</view>
				</view>

				<view class="content_bg" style="padding-bottom: 24rpx;"
					v-if="detailsInfo.exception_status == 1 || detailsInfo.exception_status == 2">
					<view class="abnormal_title">异常处理</view>
					<view class="abnormal_item flex align-center">
						<view class="abnormal_item_1">异常原因：</view>
						<view class="abnormal_item_2">{{detailsInfo.exception_reason}}</view>
					</view>
					<view class="abnormal_item flex align-center">
						<view class="abnormal_item_1">处理状态：</view>
						<view class="abnormal_item_3" v-if="detailsInfo.exception_status == 1">处理中</view>
						<view class="abnormal_item_2" v-if="detailsInfo.exception_status == 2">处理完成</view>
					</view>
					<view class="step_list">
						<view class="flex" v-for="(v, k) in riskList" :key="k">
							<view class="step_le flex flex-direction align-center">
								<view class="step_le_1">
									<view class="step_le_2">
										<view class="step_le_3"></view>
									</view>
								</view>
								<view class="step_le_4" v-if="detailsInfo.exception_status == 1"></view>
								<view class="step_le_4"
									v-if="detailsInfo.exception_status == 2 && k != riskList.length - 1"></view>
							</view>

							<view class="step_ri">
								<view class="step_ri_1">{{v.name}}</view>
								<view class="step_ri_2">{{v.content}}</view>
								<view class="step_ri_3">{{v.create_at}}</view>
							</view>
						</view>
						<view class="flex" v-if="detailsInfo.exception_status == 1">
							<view class="step_le flex flex-direction align-center">
								<view class="step_le_5"></view>
							</view>

							<view class="step_ri">
								<view class="step_ri_4">处理中</view>
							</view>
						</view>

					</view>
					<view class="flex align-center justify-between" style="margin-top: 24rpx;"
						v-if="detailsInfo.exception_status == 1">
						<view class="risk_btn_1 flex align-center justify-center" @tap.stop="openRisk(2)">处理异常</view>
						<view class="risk_btn_2 flex align-center justify-center" @tap.stop="riskSuccess">处理完成</view>
					</view>
				</view>
				<view class="content_bg" style="padding-bottom: 24rpx;" v-if="logList.length > 0">
					<view class="abnormal_title flex align-center justify-between" @tap.stop="changeLog">
						<view class="">订单操作日志</view>
						<u-icon v-if="!logShow" size="28" name="arrow-down" color="#999"></u-icon>
						<u-icon v-else size="28" name="arrow-up" color="#999"></u-icon>
					</view>
					<template v-if="logShow">
						<view class="log_item" v-for="(v, k) in logList" :key="k">
							<view class="log_item_1">操作人：{{v.name}}</view>
							<view class="log_item_2">操作内容：{{v.content}}</view>
							<view class="log_item_3">操作时间：{{v.create_at}}</view>
						</view>
					</template>
				</view>

				<view class="remarks flex align-center justify-between"
					v-if="detailsInfo.status == 2 || detailsInfo.status == 3 || detailsInfo.status == 4">
					<view @tap.stop="handleJumpDiy" data-type="navigateTo"
						:data-url="`/pages/my/myOrder/payRecords?order_id=${order_id}`">支付记录</view>
					<view @tap.stop="handleJumpDiy" data-type="navigateTo"
						:data-url="`/pages/my/myOrder/changeRecords?order_id=${order_id}`">换车记录</view>
					<view @tap.stop="handleJumpDiy" data-type="navigateTo"
						:data-url="`/pages/my/myOrder/inspectionRecords?order_id=${order_id}`">验车记录</view>
					<!-- <view v-if="detailsInfo.exception_status == 0" class="risk_text" @tap.stop="openRisk(1)">上报风险</view> -->
					<view @tap.stop="signContract" v-if="detailsInfo.contract == 2">合同存档</view>
				</view>
			</view>
			<view class="picker_btn flex align-center justify-end"
				v-if="detailsInfo.status == 1 || detailsInfo.status == 2 || detailsInfo.status == 3">
				<view class="picker_btn_1 flex align-center justify-center"
					v-if="detailsInfo.status == 1 || detailsInfo.status == 2 || detailsInfo.status == 3"
					@tap.stop="handleJumpDiy" data-type="navigateTo"
					:data-url="`/pages/order/otherPrice?order_id=${order_id}&unpay_money=${detailsInfo.unpay_money}`">
					收银台</view>
				<!-- <view class="picker_btn_1 flex align-center justify-center"
					v-if="(detailsInfo.status == 1 || detailsInfo.status == 2 || detailsInfo.status == 3) && detailsInfo.from != 1"
					@tap.stop="handleJumpDiy" data-type="navigateTo"
					:data-url="`/pages/order/otherPrice?order_id=${order_id}&unpay_money=${detailsInfo.unpay_money}`">收银台</view> -->
				<view class="picker_btn_3 flex align-center justify-center" v-if="detailsInfo.exception_status == 0"
					@tap.stop="openRisk(1)">上报风险</view>
				<!-- <view class="picker_btn_2 flex align-center justify-center" v-if="detailsInfo.status == 2"
					@tap.stop="refundOrder">取消订单</view> -->
				<view class="picker_btn_2 flex align-center justify-center"
					v-if="detailsInfo.status == 2 && detailsInfo.is_check_car == 0" @tap.stop="chechCar(1)">发车验车</view>
				<view class="picker_btn_2 flex align-center justify-center"
					v-if="detailsInfo.status == 2 && detailsInfo.is_check_car == 1" @tap.stop="getDispatchCar">发车</view>
				<view class="picker_btn_2 flex align-center justify-center"
					v-if="detailsInfo.status == 3 && detailsInfo.is_check_car == 1" @tap.stop="chechCar(2)">收车验车</view>
				<view class="picker_btn_2 flex align-center justify-center"
					v-if="detailsInfo.status == 3 && detailsInfo.is_check_car == 2" @tap.stop="postcollectCar">收车</view>
			</view>

			<view style="height: 145rpx;"></view>
		</template>

		<u-popup v-model="remarkShow" mode="bottom" border-radius="28">
			<view class="screen_popup">
				<view class="screen_title flex align-center justify-between">
					<view class="">订单备注</view>
					<u-icon name="close" color="#cccccc" size="30" @click="remarkShow=false"></u-icon>
				</view>

				<view class='flex flex-wrap feedback_fd2_1'>
					<textarea class='flex feedback_input_fd2_1' confirm-type="done" :placeholder="'请输入内容'"
						:maxlength="200" placeholder-style="color:rgba(191, 191, 191, 1);font-size:30rpx"
						v-model="body" />
					<text class="feedback_num">{{body.length}}/200</text>
				</view>
				<view class="picker_btn_pop flex align-center justify-between">
					<view class="picker_btn_1 flex align-center justify-center" @tap.stop="cancelRemarks">重置</view>
					<view class="picker_btn_2 flex align-center justify-center" @tap.stop="remarksOk">确定</view>
				</view>
			</view>
		</u-popup>

		<!-- 上报风险和完成 -->
		<u-popup v-model="riskShow" mode="bottom" border-radius="28">
			<view class="risk_popup">
				<view class="risk_title flex align-center justify-between">
					<view class="" v-if="risk_type == 1">上报风险</view>
					<view class="" v-if="risk_type == 2">处理风险</view>
					<u-icon name="close" color="#cccccc" size="30" @click="riskShow=false"></u-icon>
				</view>
				<view style="padding: 0 30rpx;">
					<view class="risk_item flex align-center justify-between" v-if="risk_type == 1">
						<view class="risk_item_1">异常原因</view>
						<input v-model="exception_reason" class="risk_item_2" type="text" :placeholder="'请输入异常原因'"
							placeholder-style="color:#999;font-size:30rpx">
					</view>
					<view class="risk_item flex align-center justify-between" v-if="risk_type == 2">
						<view class="risk_item_1">对接人处理</view>
						<input v-model="contact_name" class="risk_item_2" type="text" :placeholder="'请输入对接人名称'"
							placeholder-style="color:#999;font-size:30rpx">
					</view>
					<view class="risk_item flex align-center justify-between" v-if="risk_type == 2">
						<view class="risk_item_1">对接人联系方式</view>
						<input v-model="contact_phone" class="risk_item_2" type="number" :placeholder="'请输入对接人手机号'"
							maxlength="11" placeholder-style="color:#999;font-size:30rpx">
					</view>
					<view class='flex flex-wrap risk_textarea'>
						<textarea class='flex risk_textarea_1' confirm-type="done" :placeholder="'请输入异常备注'"
							:maxlength="200" placeholder-style="color:#999;font-size:30rpx"
							v-model="exception_remark" />
					</view>
					<view class="picker_btn_pop flex align-center justify-between" style="padding: 12rpx 0 28rpx;">
						<view class="picker_btn_1 flex align-center justify-center" @tap.stop="riskCancel">重置</view>
						<view class="picker_btn_2 flex align-center justify-center" @tap.stop="riskConfirm">确定</view>
					</view>
				</view>
			</view>
		</u-popup>

		<u-mask :show="codeShow">
			<view class="warp">
				<view class="rect">
					<view class="free_code">
						<view class="code_view">
							<view class="qrcode_img">
								<!-- <image :src='STATIC_URL+"447.png"' mode="aspectFill"></image> -->
								<uv-qrcode ref="qrcode" size="352rpx" :value="codeUrl"></uv-qrcode>
							</view>
							<view class="qrcode_text" @tap.stop="signDirectly">点击在线签署合同</view>
						</view>
						<!-- <view class="operation_btn flex align-center justify-between">
							<view class="operation_1">分享用户</view>
							<view class="operation_2">下载该码</view>
						</view> -->
						<view class="code_btn flex align-center justify-center" @tap.stop="clearCode">关闭</view>
					</view>
				</view>
			</view>
		</u-mask>


		<u-popup v-model="popupShow1698293086456" border-radius="24" :mask="true" :mask-close-able="true" mode='center'>
			<!---删除历史记录弹窗flex布局开始-->
			<view class="flex flex-direction flex-wrap align-center search_flex_2">
				<text class='search_fd2_0'>提示</text>
				<text class='search_fd2_1'>请确认车辆押金是否已付？</text>
				<view class='flex flex-wrap align-center search_fd2_2'>
					<view class='search_fd2_2_c0 flex align-center justify-center'
						@tap.stop="popupShow1698293086456=false">取消</view>
					<view class='search_fd2_2_c1 flex align-center justify-center' @tap.stop="confirmFache()">确认</view>
				</view>
			</view>
		</u-popup>

		<u-popup v-model="refundShow" border-radius="24" :mask="true" :mask-close-able="true" mode='bottom'>
			<view class="refund_pop">
				<view class="refund_title">取消订单</view>
				<view class="refund_view">订单已支付</view>
				<view class="refund_money" v-if="!detailsInfo.all_items_has_pay">
					￥{{Number(detailsInfo.money)-Number(detailsInfo.unpay_money)}}</view>
				<view class="refund_money" v-else>￥{{Number(detailsInfo.money)}}</view>
				<view class="refund_view">取消方式</view>
				<view class="refund_type flex align-center justify-between">
					<view class="refund_type_item flex align-center justify-center"
						:class="refund_type == 1 ? 'active_type_item' : ''" @tap.stop="selectRefund(1)">免费取消</view>
					<view class="refund_type_item flex align-center justify-center"
						:class="refund_type == 2 ? 'active_type_item' : ''" @tap.stop="selectRefund(2)">违约金取消</view>
				</view>
				<template v-if="refund_type == 2">
					<view class="refund_view">违约金</view>
					<view class="refund_input flex align-center">
						<text>￥</text>
						<input type="number" v-model="damages" placeholder="请输入退款金额"
							placeholder-style="font-size: 26rpx;color: #999" style="font-size: 28rpx;" :disabled="true">
					</view>
					<view class="refund_custom">
						<text>退款金额：</text>
						<text class="refund_custom_price">￥{{refund_price}}</text>
					</view>
				</template>
				<view class="refund_btn flex align-center justify-between">
					<view class="refund_btn_1 flex align-center justify-center" @tap.stop="refundShow=false">取消</view>
					<view class="refund_btn_2 flex align-center justify-center" @tap.stop="confirmRefund">确认</view>
				</view>
			</view>
		</u-popup>

		<u-modal v-model="cancelShow" content="确认取消当前订单吗？" :show-cancel-button="true" confirm-color="#1A66FA"
			@confirm="confirmCancel"></u-modal>


		<u-modal v-model="depositRefundShow" content="确认解冻押金吗？" :show-cancel-button="true" confirm-color="#1A66FA"
			@confirm="depositRefund"></u-modal>

		<u-modal v-model="reissueShow" content="确认补发优惠券吗？" :show-cancel-button="true" confirm-color="#1A66FA"
			@confirm="reissueConfirm"></u-modal>

		<u-popup v-model="priceShow" mode="center" border-radius="32">
			<view class="deductible_popup">
				<view class="pop_title">设置免押价格</view>
				<view class="input_view flex align-center" style="margin-top: 14rpx;">
					<text class="money_icon">￥</text>
					<input v-model="depositPrice" maxlength="20000" style="padding: 0 30rpx 0 16rpx;" class="input"
						type="number" placeholder="请输入金额" placeholder-style="font-size:32rpx;color:#999;">
				</view>
				<view class="operation flex align-center justify-between" style="margin: 94rpx 0 54rpx;">
					<view class="operation_1 flex align-center justify-center" @tap.stop="priceShow=false">取消</view>
					<view class="operation_2 flex align-center justify-center" @tap.stop="initXinyong">确定</view>
				</view>
				<view class="pop_bg"></view>
			</view>
		</u-popup>

		<u-mask :show="depositShow">
			<view class="warp">
				<view class="rect">
					<view class="free_code">
						<view style="text-align: center;font-weight: 600;margin-bottom: 32rpx;">免押码</view>
						<view class="code_view">
							<view class="qrcode_img">
								<!-- <image :src='STATIC_URL+"447.png"' mode="aspectFill"></image> -->
								<uv-qrcode ref="qrcode" size="352rpx" :value="depositUrl"></uv-qrcode>
								<!-- <uni-qrcode style="width: 100%;height: 100%;" :text="depositUrl" :size="176"></uni-qrcode> -->
								<!-- <canvas id="qrcode" canvas-id="qrcode" style="width: 176px;height: 176px;"></canvas> -->
							</view>
						</view>
						<!-- <view class="operation_btn flex align-center justify-between">
							<view class="operation_1">分享用户</view>
							<view class="operation_2">下载该码</view>
						</view> -->
						<view class="code_btn flex align-center justify-center" @tap.stop="clearCode">关闭</view>
					</view>
				</view>
			</view>
		</u-mask>

		<u-modal v-model="abnormalShow" content="确认当前异常处理完成吗？" :show-cancel-button="true" confirm-color="#1A66FA"
			@confirm="riskEnd"></u-modal>
	</view>
</template>
<script>
	import utils from "@/common/utils/utils.js"
	import {
		validate
	} from '@/common/utils/validate.js'
	// import UQRCode from 'uqrcodejs';
	// import QRCode from 'uniapp-qrcode'
	export default {
		components: {},

		data() {
			return {
				popupShow1698293086456: false,
				codeShow: false,
				remarkShow: false,
				riskShow: false,
				body: "",
				order_id: "",
				isShow: true,
				detailsInfo: {},
				timeData: {},
				exception_reason: "",
				exception_remark: "",
				risk_type: 1, // 1上报风险  2处理风险
				riskList: [],
				logList: [],
				contact_name: "",
				contact_phone: "",
				upgrade_name: "",
				other_order_pay_item: [],
				other_price_show: false,
				cancelShow: false,
				refundShow: false,
				refund_price: 0, // 客户退款金额
				damages: 0, // 违约金
				refund_type: 1,
				relet: [], // 续租信息
				is_contract: false,
				logShow: false,
				codeUrl: "", // 合同地址
				groupon_info: [], // 团购券列表
				depositShow: false,
				depositUrl: "",
				priceShow: false,
				depositPrice: 10000,
				depositRefundShow: false, // 解冻押金确认提示
				abnormalShow: false, // 异常完成确认提示

				otaName: "", // OTA平台名称
				otaId: "", // OTA平台id
				collectStatus: false, // 收车防抖标识
				userInfo: "",
				reissueShow: false,
			};
		},
		computed: {

		},
		watch: {},
		onLoad(options) {
			let {
				order_id
			} = options;
			if (order_id !== undefined) this.order_id = order_id;
			// this.order_id = 8;

			this.getOrderLog2();
			uni.$on('setLog', res => {
				this.$message.info('提交成功');
				this.getDetails();
				this.getOrderLog();
				this.getOrderLog2();
			})
			uni.$on('changeUser', res => {
				this.changeUserInfo(res);
			})
			uni.$on('changeCar', res => {
				this.getDetails();
				this.getOrderLog2();
			})
			uni.$on('changeTime', res => {
				this.confirmChangeTime(res);
			})
			this.userInfo = global.userInfo;
			console.log(this.userInfo);
		},
		onUnload() {
			uni.$off('setLog');
			uni.$off('changeUser');
			uni.$off('changeCar');
			uni.$off('changeTime');
		},
		onReady() {

		},
		onShow() {
			// this.isShow = true;
			this.getDetails();
		},
		onHide() {

		},
		onResize() {

		},
		onPullDownRefresh() {
			this.getDetails();
			this.getOrderLog2();
		},
		onReachBottom(e) {

		},
		onPageScroll(e) {

		},
		methods: {
			initXinyong() {
				if (this.depositPrice <= 0) {
					this.$message.info('请输入免押金额');
					return;
				}
				this.priceShow = false;
				uni.showLoading({
					title: '加载中'
				})
				this.$api.post(global.apiUrls.depositRequired, {
					order_id: this.order_id,
					money: this.depositPrice
				}).then(res => {
					// console.log(res);
					uni.hideLoading();
					if (res.data.code == 1) {
						this.depositUrl =
							`alipays://platformapi/startapp?appId=2021004104689050&nbupdate=syncforce&page=%2Fpages%2FtabBar%2Findex%2Findex%3Ffreeze_order_id%3D${this.order_id}%26money%3D${this.depositPrice}`
						// %3Fmoney%3D${this.depositPrice}
						// this.depositUrl = `alipays://platformapi/startapp?appId=2021003188651490&nbupdate=syncforce&page=%2Fpages%2Fopen%2Findex%3ForderStr%3D%22${res.data.data.data}%22`;
						this.depositShow = true;
					} else {
						this.$message.info(res.data.info);
					}
				}).catch(err => {
					uni.hideLoading();
				})
			},
			openXinyong() {
				this.priceShow = true;
			},

			// 解冻押金
			depositRefund() {
				this.depositRefundShow = false;
				this.$api.post(global.apiUrls.depositThaw, {
					order_id: this.order_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
					}
				}).catch(err => {

				})
			},
			// 补发优惠券
			reissueConfirm() {
				this.reissueShow = false;
				this.$api.post(global.apiUrls.couponSend, {
					order_id: this.order_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.getDetails();
					}
				})
			},
			// 修改租车时间
			changeOrderTime() {
				if (this.detailsInfo.status == 1 || this.detailsInfo.status == 2) {
					if (this.otaId) {
						global.ota_id = this.otaId;
					}
					global.timeData = this.timeData;
					uni.navigateTo({
						url: '/pages/index/selectVehicle/selectTime'
					})
				}
			},
			confirmChangeTime(timeInfo) {
				console.log(timeInfo);
				this.$api.post(global.apiUrls.changeCarTime, {
					order_id: this.order_id,
					take_at: timeInfo.toDay,
					repay_at: timeInfo.twoDay,
					store_id: this.detailsInfo.store_id,
					user_id: global.userInfo.id
				}).then(res => {
					// console.log(res);
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.getDetails();
						this.getOrderLog2();
					}
				})
			},
			// 修改租客  changeOrderUser
			changeUserInfo(user_id) {
				this.$api.post(global.apiUrls.changeOrderUser, {
					order_id: this.order_id,
					user_id: user_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				})
			},
			// 获取订单详情  postOrderDetail
			getDetails() {
				this.$api.post(global.apiUrls.postOrderDetail, {
					order_id: this.order_id
				}).then(res => {
					// console.log(res);
					this.isShow = false;
					uni.stopPullDownRefresh();
					if (res.data.code == 1) {
						this.detailsInfo = res.data.data;
						this.groupon_info = [];
						if (Array.isArray(res.data.data.groupon_info)) {
							if (res.data.data.groupon_info.length == 0) {
								this.groupon_info = [];
							} else {
								this.groupon_info = res.data.data.groupon_info;
							}

						} else {
							let arrItem = res.data.data.groupon_info;
							this.groupon_info.push(arrItem);
						}

						this.other_order_pay_item = this.detailsInfo.other_order_pay_item;
						// if (this.detailsInfo.f_order_id != 0) {
						// 	this.relet = res.data.data.relet;
						// }
						this.relet = res.data.data.relet;
						if (this.detailsInfo.exception_status != 0) {
							this.getOrderLog();
						}
						this.getCarInsure();
						this.getRefundConfig();
						this.getOrderLog2();
						let toDay = this.detailsInfo.take_at;
						let week = utils.getWeekday(toDay);
						let twoDay = this.detailsInfo.repay_at;
						let twoWeek = utils.getWeekday(twoDay);
						this.timeData = {
							dayNum: this.detailsInfo.lease_day,
							is_today: this.detailsInfo.take_at == utils.getNowTime() ? 1 : 0,
							toDay: toDay,
							toDay_month: (toDay.substring(5, 10)).replace('-', '月') + '日',
							toDay_time: toDay.substring(11, 16),
							week: week,
							twoDay: twoDay,
							twoDay_month: (twoDay.substring(5, 10)).replace('-', '月') + '日',
							twoDay_time: twoDay.substring(11, 16),
							twoWeek: twoWeek,
							interval: utils.calculateDifference(toDay, twoDay)
						}

						if (uni.getStorageSync('ota')) {
							let otaList = uni.getStorageSync('ota');
							let otaItem = otaList.find(item => {
								return item.id == this.detailsInfo.from;
							})
							if (otaItem) {
								this.otaName = otaItem.name;
								this.otaId = otaItem.id;
							}
						}
					} else {
						this.$message.info(res.data.info);
					}
				}).catch(err => {
					console.log(err);
				})
			},
			// 获取退款比例  postConfig
			getRefundConfig() {
				this.$api.get(global.apiUrls.refundInformation, {
					order_id: this.order_id
				}).then(res => {
					console.log(res);
					if (res.data.code == 1) {
						// let fractionDigits = 2; // 保留2位小数
						// let value1 = 0;
						// if (!this.detailsInfo.all_items_has_pay) {
						// 	value1 = (Number(this.detailsInfo.money) - Number(this.detailsInfo.unpay_money)) * (
						// 		Number(res.data.data.refund_percentage) / 100);
						// } else {
						// 	value1 = Number(this.detailsInfo.money) * (Number(res.data.data.refund_percentage) /
						// 		100);
						// }

						// let result1 = +`${value1}e${fractionDigits}`; // 145.78
						// result1 <<= 0; // 145
						// this.refund_price = +`${result1}e${-fractionDigits}`; // 1.45
						// let value2 = 0;
						// if (!this.detailsInfo.all_items_has_pay) {
						// 	value2 = (Number(this.detailsInfo.money) - Number(this.detailsInfo.unpay_money)) * ((
						// 		100 - Number(res.data.data
						// 			.refund_percentage)) / 100);
						// } else {
						// 	value2 = Number(this.detailsInfo.money) * ((100 - Number(res.data.data
						// 		.refund_percentage)) / 100);
						// }

						// let result2 = +`${value2}e${fractionDigits}`; // 145.78
						// result2 <<= 0; // 145

						this.refund_price = Number(res.data.data.payment_amount) - Number(res.data.data
						.wyj_amount);
						this.damages = res.data.data.wyj_amount;
					} else {
						this.$message.info(res.data.info);
					}
				})
			},

			// 车辆保障数据列表  postEnhancedService
			getCarInsure() {
				this.$api.post(global.apiUrls.postEnhancedService, {
					car_id: this.detailsInfo.car_id,
					store_id: this.detailsInfo.store_id
				}).then(res => {
					// console.log(res);
					if (res.data.code == 1) {
						if (res.data.data.length > 0) {
							res.data.data.forEach((v, k) => {
								if (v.id == this.detailsInfo.insure_plus_id) {
									this.upgrade_name = v.name;
								}
							})
						}

					} else {
						this.$message.info(res.data.info);
					}
				})
			},
			// 获取风险内容
			getOrderLog() {
				this.$api.post(global.apiUrls.postGetOrderLog, {
					id: this.order_id,
					type: 1
				}).then(res => {
					// console.log(res);
					if (res.data.code == 1) {
						this.riskList = res.data.data;
					} else {
						this.$message.info(res.data.info);
					}
				})
			},
			// 获取订单日志
			getOrderLog2() {
				this.$api.post(global.apiUrls.postGetOrderLog, {
					id: this.order_id,
					type: 0
				}).then(res => {
					// console.log(res);
					if (res.data.code == 1) {
						this.logList = res.data.data;
					} else {
						this.$message.info(res.data.info);
					}
				})
			},
			changeLog() {
				this.logShow = !this.logShow;
			},

			// 拨打电话
			getPhone(phone) {
				uni.makePhoneCall({
					phoneNumber: phone //仅为示例
				});
			},
			remarksOk() {
				if (!this.body) {
					this.$message.info('请输入备注内容');
					return;
				}
				this.remarkShow = false;
				// global.order_id = this.order_id;
				// global.logMsg = this.body;
				// // global.is_risk = 0;
				// getApp().recordLogs();
				// this.remarkShow = false;
				// this.body = "";
				this.$api.post(global.apiUrls.changeOrderRemark, {
					order_id: this.order_id,
					remark: this.body
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.body = "";
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				})
			},
			cancelRemarks() {
				this.body = "";
				this.remarkShow = false;
			},
			openRisk(type) {
				this.risk_type = type;
				this.riskShow = true;
			},
			// 上报风险
			riskConfirm() {
				if (this.risk_type == 1) {
					if (!this.exception_reason) {
						this.$message.info('请输入异常原因');
						return;
					}
					if (!this.exception_remark) {
						this.$message.info('请输入异常备注');
						return;
					}
					this.riskShow = false;
					this.$api.post(global.apiUrls.postSetException, {
						order_id: this.order_id,
						exception_reason: this.exception_reason,
						exception_remark: this.exception_remark
					}).then(res => {
						this.$message.info(res.data.info);
						if (res.data.code == 1) {
							this.exception_reason = "";
							this.exception_remark = "";
							this.getDetails();
							this.getOrderLog();
						}
					})
				} else {
					if (!this.contact_name) {
						this.$message.info('请输入对接人名称');
						return;
					}
					if (!this.exception_remark) {
						this.$message.info('请输入异常备注');
						return;
					}
					this.riskShow = false;
					let content = '对接人：' + this.contact_name + ',' + (this.contact_phone ? '手机号：' + this.contact_phone +
						',' : '') + '处理异常：' + this.exception_remark;
					console.log(content);
					global.order_id = this.order_id;
					global.logMsg = content;
					global.is_risk = 1;
					getApp().recordLogs();
				}
			},
			riskCancel() {
				this.exception_reason = "";
				this.exception_remark = "";
				this.contact_name = "";
				this.contact_phone = "";
				this.riskShow = false;
			},
			// 异常处理完成确认提示  riskCompleted
			riskSuccess() {
				this.abnormalShow = true;
			},
			riskEnd() {
				this.$api.post(global.apiUrls.riskCompleted, {
					order_id: this.order_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog();
					}
				})
			},

			// 签署合同
			signContract() {
				if (this.is_contract) return;
				if (this.detailsInfo.contract == 0) {
					this.is_contract = true;
					uni.showLoading({
						title: '加载中'
					})
					this.$api.post(global.apiUrls.initContract, {
						order_id: this.order_id
						// user_id: this.detailsInfo.user_id
					}).then(res => {
						// console.log(res);
						uni.hideLoading();
						this.is_contract = false;
						if (res.data.code == 1) {
							this.codeUrl = res.data.data;
							this.codeShow = true;
							this.getDetails();
							this.getOrderLog2();
							// if (res.data.data.code == 0) {
							// 	this.codeUrl = res.data.data.result.pageUrl;
							// 	this.codeShow = true;
							// 	this.getDetails();
							// 	this.getOrderLog2();
							// } else {
							// 	this.$message.info(res.data.data.message);
							// }
						} else {
							this.$message.info(res.data.info);
						}
					}).catch(err => {
						uni.hideLoading();
						this.is_contract = false;
					})
				} else if (this.detailsInfo.contract == 1) {
					this.is_contract = true;
					uni.showLoading({
						title: '加载中'
					})
					this.$api.post(global.apiUrls.viewContract, {
						// cid: this.detailsInfo.contract_id,
						order_id: this.order_id
					}).then(res => {
						console.log(res);
						uni.hideLoading();
						this.is_contract = false;
						if (res.data.code == 1) {
							this.codeUrl = res.data.data;
							this.codeShow = true;
							this.getDetails();
							this.getOrderLog2();
							// if (res.data.data.code == 0) {
							// 	this.codeUrl = res.data.data.result.pageUrl;
							// 	this.codeShow = true;
							// 	this.getDetails();
							// 	this.getOrderLog2();
							// } else {
							// 	this.$message.info(res.data.data.message);
							// }
						} else {
							this.$message.info(res.data.info);
						}
					}).catch(err => {
						uni.hideLoading();
						this.is_contract = false;
					})
				} else if (this.detailsInfo.contract == 2) {
					uni.showLoading({
						title: '加载中'
					})
					let _this = this;
					uni.downloadFile({
						url: _this.detailsInfo.contract_url,
						success: function(res) {
							uni.hideLoading();
							var filePath = res.tempFilePath;
							uni.openDocument({
								filePath: filePath,
								showMenu: true,
								success: function(res) {
									console.log('打开文档成功');
								}
							});
						},
						fail: function(err) {
							uni.hideLoading();
							_this.$message.info('加载失败');
						}
					});
				}

				// if (this.detailsInfo.is_auth == 1) {

				// } else {
				// 	this.$message.info('请完善会员资料');
				// 	setTimeout(() => {
				// 		uni.navigateTo({
				// 			url: '/pages/my/personalInformation/personalInformation?user_id=' + this
				// 				.detailsInfo.user_id
				// 		})
				// 	}, 800)
				// }
			},
			// 在线签署合同
			signDirectly() {
				this.codeShow = false;
				global.contractUrl = this.codeUrl;
				this.codeUrl = "";
				uni.navigateTo({
					url: '/pages/order/contract'
				})
			},
			clearCode() {
				this.codeShow = false;
				this.codeUrl = "";
				this.depositShow = false;
				this.depositPrice = 10000;
				this.depositUrl = "";
			},
			// 验车
			chechCar(type) {
				if (this.detailsInfo.is_auth == 1) {
					uni.navigateTo({
						url: '/pages/order/inspection?type=' + type + '&order_id=' + this.order_id
					})
				} else {
					this.$message.info('请完善会员资料');
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/my/personalInformation/personalInformation?user_id=' + this
								.detailsInfo.user_id
						})
					}, 800)
				}
			},
			// 管家发车  dispatchCar
			getDispatchCar() {
				this.popupShow1698293086456 = true;
			},
			confirmFache() {
				this.popupShow1698293086456 = false;
				this.$api.post(global.apiUrls.dispatchCar, {
					order_id: this.order_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				})
			},
			// 管家收车  collectsCar
			postcollectCar() {
				if (this.detailsInfo.unpay_money > 0) {
					this.$message.info('订单有未支付金额,请支付后收车');
					return;
				}
				if (this.collectStatus) return;
				this.collectStatus = true;
				this.$api.post(global.apiUrls.collectsCar, {
					order_id: this.order_id
				}).then(res => {
					this.collectStatus = false;
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				}).catch(err => {
					this.collectStatus = false;
				})
			},
			// 取消订单
			openCancel() {
				this.cancelShow = true;
			},
			confirmCancel() {
				this.cancelShow = false;
				uni.showLoading({
					title: '取消中'
				})
				this.$api.post(global.apiUrls.postRefund, {
					order_id: this.order_id,
					user_id: this.detailsInfo.user_id,
					pid: global.userInfo.id
				}).then(res => {
					uni.hideLoading();
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				}).catch(err => {
					uni.hideLoading();
				})

			},
			// 退款
			refundOrder() {
				this.refundShow = true;
			},
			selectRefund(type) {
				this.refund_type = type;
			},
			// 确认退款
			confirmRefund() {
				this.refundShow = false;
				uni.showLoading({
					title: '取消中'
				})
				this.$api.post(global.apiUrls.postRefund, {
					order_id: this.order_id,
					user_id: this.detailsInfo.user_id,
					pid: global.userInfo.id,
					type: this.refund_type == 1 ? 1 : 0
				}).then(res => {
					uni.hideLoading();
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				}).catch(err => {
					uni.hideLoading();
				})
			},
			// 线下支付  offlinePay
			postOfflinePay() {
				uni.showLoading({
					title: '处理中'
				})
				this.$api.post(global.apiUrls.offlinePay, {
					order_id: this.order_id
				}).then(res => {
					uni.hideLoading();
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
						this.getOrderLog2();
					}
				}).catch(err => {
					uni.hideLoading();
				})
			},
			// 续租
			goRenewal() {
				uni.navigateTo({
					url: '/pages/order/renewalTime?order_id=' + this.order_id + '&timeData=' + JSON.stringify(this
						.timeData)
				})
			},
			// 取消续租
			cancelRenewal() {
				uni.navigateTo({
					url: '/pages/order/cancelRenewal?order_id=' + this.order_id
				})
			},


			// 打开地图
			openLocationInfo() {
				let lat = this.detailsInfo.door_to_door == 1 ? Number(this.detailsInfo.store_lat) : Number(this.detailsInfo
					.lat);
				let lon = this.detailsInfo.door_to_door == 1 ? Number(this.detailsInfo.store_lng) : Number(this.detailsInfo
					.lng);
				let addressName = this.detailsInfo.door_to_door == 1 ? this.detailsInfo.store_name : this.detailsInfo
					.address;
				uni.openLocation({
					name: addressName,
					address: addressName,
					latitude: lat,
					longitude: lon,
					success: function() {
						console.log('success');
					},
					fail: function(err) {
						console.log(err);
					}
				});
			},

			roundNum(num, precision) {
				var multiplier = Math.pow(10, precision || 0);
				return Math.round(num * multiplier) / multiplier;
			},

			copyToClipboard(text) {
				uni.setClipboardData({
					data: text,
					success: function() {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						});
					},
					fail: function() {}
				});
			}
		}
	};
</script>
<style lang="scss" scoped>
	.offline_view {
		padding: 24rpx 0;
		border-top: 1px solid #eee;

		.offline_text {
			border: 1px solid #eee;
			width: 160rpx;
			height: 52rpx;
			border-radius: 8rpx;
			font-size: 24rpx;
			margin-left: 24rpx;
		}
	}

	.refund_pop {
		padding: 0 30rpx 30rpx;

		.refund_title {
			font-size: 34rpx;
			text-align: center;
			padding: 28rpx 0;
		}

		.refund_view {
			font-size: 28rpx;
		}

		.refund_money {
			font-weight: 600;
			margin: 16rpx 0 24rpx;
		}

		.refund_type {
			padding: 0 24rpx;
			margin: 24rpx 0;

			.refund_type_item {
				background: #f6f6f6;
				width: 300rpx;
				height: 78rpx;
				border-radius: 12rpx;
			}

			.active_type_item {
				background: #fff;
				color: #1A66FA;
				border: 1px solid #1A66FA;
			}
		}

		.refund_input {
			border: 1px solid #eee;
			margin: 24rpx 0;
			padding: 10rpx 24rpx;
			font-size: 28rpx;
			border-radius: 8rpx;
		}

		.refund_custom {
			margin: 24rpx 0;
			font-size: 26rpx;

			.refund_custom_price {
				color: #1A66FA;
			}
		}

		.refund_btn {
			padding: 32rpx 0 0;
			border-top: 1px solid #eee;
			margin: 24rpx 0;

			.refund_btn_1 {
				background: #f6f6f6;
				width: 300rpx;
				height: 78rpx;
				border-radius: 12rpx;
			}

			.refund_btn_2 {
				color: #fff;
				background: #1A66FA;
				width: 300rpx;
				height: 78rpx;
				border-radius: 12rpx;
			}
		}
	}

	.abnormal_title {
		font-weight: bold;
		font-size: 28rpx;
		color: #000000;
		padding: 30rpx 0 0;
	}

	.abnormal_item {
		margin-top: 20rpx;

		.abnormal_item_1 {
			font-weight: 400;
			font-size: 28rpx;
			color: rgba(0, 0, 0, 0.6);
		}

		.abnormal_item_2 {
			font-weight: 400;
			font-size: 28rpx;
			color: #000;
		}

		.abnormal_item_3 {
			font-weight: 400;
			font-size: 28rpx;
			color: #FC5B03;
		}
	}

	.step_list {
		padding: 24rpx 0 0;

		.step_le {
			width: 44rpx;
			padding-top: 16rpx;

			.step_le_1 {
				width: 32rpx;
				height: 32rpx;
				background: rgba(26, 102, 250, 0.1);
				border-radius: 50%;
				position: relative;

				.step_le_2 {
					width: 19rpx;
					height: 19rpx;
					background: rgba(26, 102, 250, 0.3);
					border-radius: 50%;
					position: absolute;
					left: 50%;
					top: 50%;
					transform: translate(-50%, -50%);
				}
			}

			.step_le_3 {
				width: 10rpx;
				height: 10rpx;
				background: #1A66FA;
				border-radius: 50%;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-60%, -60%);
			}

			.step_le_5 {
				width: 10rpx;
				height: 10rpx;
				background: #1A66FA;
				border-radius: 50%;
			}
		}

		.step_ri {
			flex: 1;
			margin-left: 10rpx;

			.step_ri_1 {
				font-weight: 500;
				font-size: 24rpx;
				color: rgba(0, 0, 0, 0.8);
			}

			.step_ri_2 {
				margin-top: 12rpx;
				font-weight: 400;
				font-size: 20rpx;
				color: rgba(0, 0, 0, 0.8);
			}

			.step_ri_3 {
				margin-top: 10rpx;
				font-weight: 400;
				font-size: 20rpx;
				color: rgba(102, 102, 102, 0.8);
			}

			.step_ri_4 {
				font-weight: 500;
				font-size: 24rpx;
				color: #FC5B03;
			}
		}

		.step_le_4 {
			width: 1px;
			min-height: 100rpx;
			background: #1A66FA;
			border-radius: 2rpx;
			margin: 12rpx 0 0;
		}
	}

	.log_item {
		margin-top: 24rpx;
		border-top: 1px solid #eee;
		padding-top: 24rpx;

		.log_item_1 {
			font-weight: 500;
			font-size: 24rpx;
			color: rgba(0, 0, 0, 0.8);
		}

		.log_item_2 {
			margin-top: 12rpx;
			font-weight: 400;
			font-size: 22rpx;
			color: rgba(0, 0, 0, 0.8);
		}

		.log_item_3 {
			margin-top: 10rpx;
			font-weight: 400;
			font-size: 20rpx;
			color: rgba(102, 102, 102, 0.8);
		}
	}

	.risk_btn_1 {
		width: 160rpx;
		height: 58rpx;
		background: #F6F7FB;
		border-radius: 44rpx;
		font-weight: 400;
		font-size: 24rpx;
		color: #222222;
	}

	.risk_btn_2 {
		width: 160rpx;
		height: 58rpx;
		background: #FFFFFF;
		border-radius: 44rpx;
		border: 2rpx solid #1A66FA;
		font-weight: 400;
		font-size: 24rpx;
		color: #1A66FA;
	}

	.screen_popup {
		.screen_title {
			padding: 30rpx 30rpx 30rpx 30rpx;
			font-weight: bold;
			font-size: 36rpx;
			color: #222222;
			border-bottom: 1px solid #eee;
		}

		.second_title {
			padding: 0 30rpx;
			margin: 32rpx 0 24rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #000000;
		}

		.screen_list {
			overflow: hidden;
			padding: 0 30rpx;

			.screen_item {
				float: left;
				margin-right: 12rpx;
				margin-bottom: 12rpx;
				width: 164rpx;
				height: 80rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				border: 2rpx solid #F6F7FB;
			}

			.active_item {
				background: #F1F6FF;
				border: 2rpx solid #AAC7FF;
				color: #1A66FA;
			}

			.screen_item:nth-child(4n+4) {
				margin-right: 0;
			}
		}

		.screen_date {
			width: 692rpx;
			height: 80rpx;
			border-radius: 16rpx;
			border: 2rpx solid #EEEEEE;
			margin: 0 30rpx;
			padding-left: 46rpx;

			.date_icon {
				width: 40rpx;
				height: 40rpx;
			}

			.date_content {
				margin-left: 54rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #666666;

				.date_content_line {
					margin: 0 86rpx;
				}
			}
		}


		.feedback_fd2_1 {
			background: #f6f7fb;
			border-radius: 8rpx;
			margin: 30rpx 30rpx 0;
			font-size: 26rpx;
			position: relative;
		}

		.feedback_input_fd2_1 {
			padding: 32rpx 34rpx 60rpx 34rpx;
			width: 100%;
			height: 290rpx;
			font-weight: 400;
			font-size: 30rpx;
			color: #222;
		}

		.feedback_num {
			font-weight: 500;
			font-size: 26rpx;
			color: rgba(23, 19, 19, 0.4);
			position: absolute;
			right: 20rpx;
			bottom: 20rpx;
		}
	}

	.picker_btn_pop {
		background: #fff;
		padding: 12rpx 30rpx 28rpx;
		margin-top: 24rpx;

		// border-top: 1px solid #eee;
		.picker_btn_1 {
			width: 236rpx;
			height: 96rpx;
			background: #F6F7FB;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #222222;
		}

		.picker_btn_2 {
			width: 436rpx;
			height: 96rpx;
			background: #1A66FA;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #fff;
		}
	}

	.risk_popup {

		// padding: 0 30rpx;
		.risk_title {
			padding: 30rpx;
			font-weight: bold;
			font-size: 36rpx;
			color: #222222;
			border-bottom: 1px solid #eee;
		}

		.risk_item {
			padding: 30rpx 0;
			border-bottom: 1px solid #eee;

			.risk_item_1 {
				font-weight: 400;
				font-size: 30rpx;
				color: #222222;
			}

			.risk_item_2 {
				font-weight: 400;
				font-size: 30rpx;
				color: #222222;
				text-align: right;
			}
		}

		.risk_textarea {
			background: #f6f7fb;
			border-radius: 8rpx;
			margin: 30rpx 0 0;
			font-size: 26rpx;
			position: relative;

			.risk_textarea_1 {
				padding: 32rpx 34rpx 60rpx 34rpx;
				width: 100%;
				height: 258rpx;
				font-weight: 400;
				font-size: 30rpx;
				color: #222;
			}
		}
	}

	.page_content {
		padding: 24rpx 24rpx 0;

		.card_no {
			.card_no_text {
				font-weight: bold;
				font-size: 44rpx;
				color: #FFFFFF;
			}

			.order_source {
				width: 90rpx;
				height: 40rpx;
				margin-left: 12rpx;
			}

			.order_source_timeout {
				margin-left: 12rpx;
				font-size: 22rpx;
				width: 90rpx;
				height: 40rpx;
				transform: skewX(-8deg);
				background: #ED4827;
				color: rgba(255, 255, 255, 0.7);
				font-weight: 400;
				border-radius: 9rpx;

				.order_source_timeout_text {
					transform: skewX(8deg);
				}
			}

			.housekeep {
				margin-left: 12rpx;
				font-size: 22rpx;
				width: 90rpx;
				height: 40rpx;
				transform: skewX(-8deg);
				background: #fff;
				color: #1A66FA;
				font-weight: 400;
				border-radius: 9rpx;

				.housekeep_text {
					transform: skewX(8deg);
				}
			}

			.housekeep_ks {
				width: 90rpx;
				margin-left: 8rpx;
				font-size: 22rpx;
				height: 40rpx;
				transform: skewX(-8deg);
				background: #fff;
				color: #FF4906;
				font-weight: 400;
				border-radius: 9rpx;

				.housekeep_text {
					transform: skewX(8deg);
				}
			}

			.housekeep_ota {
				min-width: 110rpx;
				margin-left: 12rpx;
				font-size: 22rpx;
				height: 40rpx;
				transform: skewX(-8deg);
				background: #fff;
				color: #1A66FA;
				font-weight: 400;
				border-radius: 9rpx;

				.housekeep_text {
					transform: skewX(8deg);
				}
			}

			.order_status {
				font-weight: 400;
				font-size: 24rpx;
				color: #FFFFFF;
				padding-right: 24rpx;
			}
		}

		.label_info {
			margin-top: 12rpx;

			.label_list {
				margin-top: 14rpx;
				overflow: hidden;

				.label_item {
					float: left;
					padding: 4rpx 20rpx;
					margin: 0 12rpx 0rpx 0;
					border-radius: 8rpx;
					font-weight: 400;
					font-size: 22rpx;
					color: #fff;
					border: 1px solid rgba(255, 255, 255, 0.4);
				}
			}

			.price_le {
				.price_le_1 {
					font-size: 24rpx;
					color: #fff;
				}

				.price_le_2 {
					font-size: 28rpx;
					font-weight: bold;
					color: #fff;
				}

				.price_le_3 {
					font-size: 40rpx;
					font-weight: bold;
					color: #fff;
				}

				.price_le_4 {
					font-size: 28rpx;
					font-weight: bold;
					color: #fff;
				}
			}
		}

		.order_date {
			margin-top: 32rpx;
			padding: 32rpx 24rpx;
			background: rgba(255, 255, 255, 0.14);
			border-radius: 16rpx;

			.date_item {
				.date_item_1 {
					font-weight: 400;
					font-size: 24rpx;
					color: #FFFFFF;
				}

				.date_item_2 {
					margin-top: 12rpx;
					font-weight: bold;
					font-size: 36rpx;
					color: #FFFFFF;
				}
			}

			.date_ce {
				text-align: center;

				.date_ce_1 {
					width: 192rpx;
					height: 10rpx;
				}

				.date_ce_2 {
					font-weight: bold;
					font-size: 30rpx;
					color: #FFFFFF;
					margin-top: 22rpx;
				}
			}
		}

		.order_date_status {
			margin-top: 16rpx;
			padding: 32rpx 24rpx;
			background: #fff;
			border-radius: 16rpx;

			.date_item_status {
				.date_item_status_1 {
					font-weight: bold;
					font-size: 36rpx;
					color: #111;
				}

				.date_item_status_2 {
					font-weight: 400;
					font-size: 24rpx;
					color: #111;
					margin-top: 12rpx;
				}
			}

			.date_ce_status {
				text-align: center;

				.date_ce_status_1 {
					width: 192rpx;
					height: 10rpx;
				}

				.date_ce_status_2 {
					font-weight: 400;
					font-size: 30rpx;
					color: #222;
					// margin-top: 22rpx;
				}
			}

			.no_cars {
				font-weight: bold;
				font-size: 36rpx;
				color: #CCCCCC;
			}
		}

		.reserve_info {
			margin-top: 24rpx;
			width: 100%;
			// height: 168rpx;
			background: url(https://speed.zhongchuxing.com/gjdimages/468.png) no-repeat;
			background-size: 100% 100%;
			padding: 36rpx 24rpx 24rpx;

			.reserve_item {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				.copy_text {
					margin-left: 24rpx;
					color: #1A66FA;
				}
			}
		}

		.actual_time {
			background: #fff;
			border-radius: 16rpx;
			margin-top: 16rpx;
			padding: 24rpx;

			.actual_item {
				.actual_item_1 {
					font-size: 36rpx;
					font-weight: 600;
				}

				.actual_item_2 {
					font-size: 28rpx;
					margin-top: 12rpx;
				}
			}

			.date_ce {
				text-align: center;

				.date_ce_1 {
					width: 192rpx;
					height: 10rpx;
				}

				.date_ce_2 {
					font-size: 26rpx;
					// margin-top: 18rpx;
					color: #222222;
				}
			}
		}

		.content_bg {
			background: #fff;
			border-radius: 16rpx;
			margin-top: 16rpx;
			padding: 0 24rpx;
		}

		.deposit_info {
			font-size: 24rpx;
			color: #fff;
			background: #1A66FA;
			padding: 3px 10rpx;

			border-radius: 10rpx;
			margin-left: 24rpx;
			font-weight: 400;

			.deposit_img {
				width: 24rpx;
				height: 24rpx;
				margin-right: 5rpx;
			}
		}


		.infor_item {
			padding: 30rpx 0;
			border-bottom: 1px solid #eee;

			.infor_item_le {
				font-weight: bold;
				font-size: 28rpx;
				color: #000000;
			}

			.infor_item_le_1 {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}


			.infor_item_ri {
				font-weight: 400;
				font-size: 28rpx;
				color: #666666;
			}

			.infor_item_ri_1 {
				font-weight: 600;
				font-size: 24rpx;
				color: #222222;
			}

			.infor_item_ri_2 {
				font-weight: 400;
				font-size: 24rpx;
				color: #fff;
				background: #1A66FA;
				width: 100rpx;
				height: 48rpx;
				border-radius: 10rpx;
			}

			.infor_item_ri_3 {
				font-weight: bold;
				font-size: 24rpx;
				color: #FF532E;
			}

			.infor_item_ri_4 {
				font-weight: 400;
				font-size: 28rpx;
				color: #1A66FA;
			}

			.infor_item_ri_5 {
				font-weight: 400;
				font-size: 24rpx;
				color: #fff;
				background: #1A66FA;
				width: 120rpx;
				height: 48rpx;
				border-radius: 10rpx;
				margin-left: 24rpx;
			}

			.infor_item_ri_6 {
				font-weight: 400;
				font-size: 24rpx;
				color: #fff;
				background: #1A66FA;
				width: 160rpx;
				height: 48rpx;
				border-radius: 10rpx;
				margin-right: 24rpx;
			}

			.user_order {
				font-weight: 400;
				font-size: 24rpx;
				color: #fff;
				background: #1A66FA;
				width: 120rpx;
				height: 48rpx;
				border-radius: 10rpx;
				margin-left: 24rpx;
			}
		}

		.preferential {
			padding: 30rpx 0;

			.preferential_le {
				font-weight: 400;
				font-size: 24rpx;
				color: rgba(0, 0, 0, 0.6);
			}

			.preferential_ri {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}
		}

		.id_card {
			font-weight: 400;
			font-size: 28rpx;

			.id_card_1 {
				color: rgba(0, 0, 0, 0.6);
			}

			.id_card_2 {
				color: rgba(0, 0, 0, 0.8);
			}
		}

		.member_phone {
			padding: 16rpx 0;

			.member_phone_1 {
				font-weight: 400;
				font-size: 28rpx;

				.member_phone_1_1 {
					color: rgba(0, 0, 0, 0.6);
				}

				.member_phone_1_2 {
					color: rgba(0, 0, 0, 0.8);
				}
			}

			.member_phone_2 {
				width: 112rpx;
				height: 48rpx;
				background: #FFFFFF;
				border-radius: 44rpx;
				border: 2rpx solid #1A66FA;
				font-weight: 400;
				font-size: 28rpx;
				color: #1A66FA;
			}
		}

		.coupon_item {
			padding-bottom: 30rpx;

			.coupon_item_1 {
				font-weight: 400;
				font-size: 28rpx;
				color: rgba(0, 0, 0, 0.6);
			}

			.coupon_item_2 {
				font-weight: 500;
				font-size: 28rpx;
				color: rgba(0, 0, 0, 0.8);
			}
		}

		.remarks {
			background: #fff;
			border-radius: 16rpx;
			margin-top: 16rpx;
			padding: 32rpx 24rpx;

			.remarks_le {
				font-weight: bold;
				font-size: 28rpx;
				color: #000000;
			}

			.remarks_ri {
				font-weight: 400;
				font-size: 28rpx;
				color: #999999;
			}

			.remarks_ri_1 {
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}
		}

		.no_line {
			border-bottom: 0;
		}
	}

	.picker_btn {
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		background: #fff;
		padding: 12rpx 30rpx 28rpx;

		.picker_btn_1 {
			width: 220rpx;
			height: 96rpx;
			background: #F6F7FB;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #222222;
		}

		.picker_btn_2 {
			width: 220rpx;
			height: 96rpx;
			background: #1A66FA;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #fff;
			margin-left: 20rpx;
		}

		.picker_btn_3 {
			width: 220rpx;
			height: 96rpx;
			background: #FF532E;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #fff;
			margin-left: 20rpx;
		}
	}

	.page_footer {
		background: #fff;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 112rpx;
		padding: 0 24rpx;
		font-weight: 400;
		font-size: 30rpx;
		color: #222222;
	}

	.risk_text {
		color: #FF532E;
	}


	.free_code {
		width: 530rpx;
		border-radius: 28rpx;

		.free_title_img {
			width: 116rpx;
			height: 116rpx;
			margin: -40rpx auto 8rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.free_store {
			text-align: center;
			font-weight: bold;
			font-size: 32rpx;
			color: #222222;
		}

		.input_content {
			width: 534rpx;
			height: 96rpx;
			background: #F6F7FB;
			border-radius: 16rpx;
			margin: 32rpx auto;
			padding: 0 32rpx;

			.input_1 {
				font-weight: bold;
				font-size: 36rpx;
				color: #222222;
			}

			.input_2 {
				flex: 1;
				margin: 0 24rpx;
				font-size: 32rpx;
			}

			.input_3 {
				width: 32rpx;
				height: 32rpx;
			}
		}

		.code_view {
			text-align: center;

			.qrcode_img {
				margin: 0 auto;
				width: 352rpx;
				height: 352rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.qrcode_text {
				margin-top: 32rpx;
				font-weight: 600;
				font-size: 30rpx;
				color: #666666;
			}
		}

		.code_btn {
			width: 120rpx;
			height: 50rpx;
			border-radius: 8rpx;
			margin: 32rpx auto 0;
			background: #1A66FA;
			color: #fff;
			font-size: 24rpx;

		}

		.operation_btn {
			margin: 38rpx 0 0;
			padding: 0 40rpx;

			.operation_1 {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 172rpx;
				height: 64rpx;
				background: #FFFFFF;
				border-radius: 16rpx;
				border: 2rpx solid #EEEEEE;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
			}

			.operation_2 {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 172rpx;
				height: 64rpx;
				background: #1A66FA;
				border-radius: 16rpx;
				border: 2rpx solid #1A66FA;
				font-weight: 400;
				font-size: 28rpx;
				color: #fff;
			}
		}
	}

	.change_text {
		background: #1A66FA;
		font-size: 28rpx;
		color: #fff;
		width: 120rpx;
		height: 60rpx;
	}

	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.rect {
		width: 530rpx;
		background-color: #fff;
		border-radius: 28rpx;
		padding: 48rpx 0 32rpx;
	}


	.deductible_popup {
		width: 626rpx;
		position: relative;

		.pop_title {
			text-align: center;
			font-weight: 800;
			font-size: 36rpx;
			color: #222222;
			padding: 40rpx 0 12rpx;
		}

		.pop_tips {
			padding: 0 38rpx;
			margin-top: 16rpx;

			.tips_le {
				width: 8rpx;
				height: 8rpx;
				border-radius: 50%;
				background: #1A66FA;
				margin-right: 16rpx;
				transform: translateY(16rpx);
			}

			.tips_ri {
				width: calc(100% - 24rpx);
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				line-height: 36rpx;
			}
		}

		.pop_btn {
			width: 548rpx;
			height: 88rpx;
			background: #1A66FA;
			border-radius: 16rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #FFFFFF;
			margin: 66rpx auto 52rpx;
		}

		.pop_bg {
			width: 100%;
			height: 220rpx;
			background: linear-gradient(180deg, rgba(26, 102, 250, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
			border-radius: 32rpx 32rpx 0px 0px;
			position: absolute;
			top: 0;
			left: 0;
		}

		.title_text {
			padding: 36rpx 40rpx 22rpx;
			font-weight: 500;
			font-size: 30rpx;
			color: #000000;
		}

		.input_view {
			width: 548rpx;
			height: 88rpx;
			border-radius: 16rpx;
			border: 2rpx solid #1A66FA;
			padding: 24rpx 0rpx;
			margin: 0 40rpx;
			position: relative;
			z-index: 10;

			.input {
				padding: 0 30rpx;
			}

			.money_icon {
				font-weight: bold;
				font-size: 32rpx;
				color: #1A66FA;
				margin-left: 30rpx;
			}
		}

		.operation {
			margin: 46rpx 0;
			padding: 0 40rpx;
			position: relative;
			z-index: 10;

			.operation_1 {
				width: 266rpx;
				height: 88rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #222222;
			}

			.operation_2 {
				width: 266rpx;
				height: 88rpx;
				background: #1A66FA;
				border-radius: 16rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #fff;
			}
		}

		.charge_list {
			overflow: hidden;
			padding: 10rpx 40rpx 0;
			position: relative;
			z-index: 10;

			.charge_item {
				float: left;
				width: 174rpx;
				height: 80rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				margin-bottom: 10rpx;
				margin-right: 10rpx;

				image {
					width: 24rpx;
					height: 24rpx;
					margin-right: 4rpx;
				}
			}

			.increment_item {
				float: left;
				width: 174rpx;
				height: 100rpx;
				background: #F6F7FB;
				border-radius: 16rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				margin-bottom: 10rpx;
				margin-right: 10rpx;
				text-align: center;
				padding-top: 12rpx;

				image {
					width: 24rpx;
					height: 24rpx;
					margin-right: 4rpx;
				}

				.increment_item_price_icon {
					font-size: 24rpx;
				}

				.increment_item_name {
					font-size: 26rpx;
				}
			}

			.increment_item:nth-child(3n+3) {
				margin-right: 0;
			}

			.active_item {
				color: #1A66FA !important;
				background: #F1F6FF;
				border: 2rpx solid #AAC7FF;
			}

			.charge_item:nth-child(3n+3) {
				margin-right: 0;
			}
		}
	}



	.search_flex_2 {
		background: #fff;
		// margin: 0rpx 105rpx 0rpx 105rpx;
		border-radius: 25rpx 25rpx 25rpx 25rpx;
		padding: 40rpx 0rpx 0rpx 0rpx;
	}

	.search_fd2_2_c1 {
		background: transparent;
		line-height: 90rpx;
		border-radius: 0rpx 0rpx 16rpx 0rpx;
		font-size: 32rpx;
		color: #1A66FA;
		width: 269rpx;
		height: 90rpx;
	}

	.search_fd2_2_c0 {
		border-right: 1px solid #EEEEEE;
		background: transparent;
		line-height: 90rpx;
		border-radius: 0rpx 0rpx 0rpx 16rpx;
		font-size: 32rpx;
		color: #999;
		height: 90rpx;
		width: 270rpx;
	}

	.search_fd2_2 {
		border-top: 1px solid #eee;
	}

	.search_fd2_1 {
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
		margin: 48rpx 0rpx 60rpx 0rpx;
	}

	.search_fd2_0 {
		color: #333333;
		font-size: 36rpx;
		font-weight: 500;
		line-height: 45rpx;
	}

	.personalInformation_picker2_0 {
		border-bottom: 1px solid #eee;
		background: #fff;
		background-size: 100% !important;
		padding: 0rpx 32rpx 0rpx 32rpx;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
		background-size: 100% auto !important;
		height: 100rpx;
	}

	.personalInformation_picker2_0_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #BFBFBF;
	}

	.personalInformation_picker2_0_c1 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
	}

	.personalInformation_picker2_0_c2 {
		color: rgba(44, 143, 255, 1);
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
	}

	.personalInformation_fd1_0 {
		// margin-top: 32rpx;
		height: 96rpx;
		border-top: 1px solid #eee;
	}

	.personalInformation_fd1_0_c0 {
		font-weight: 400;
		font-size: 28rpx;
		color: rgba(0, 0, 0, 0.6);
	}

	.personalInformation_fd1_0_c1_image {
		width: 72rpx;
		height: 72rpx;
		border-radius: 50%;
	}

	.personalInformation_fd1_1 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_1_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_1_c1 {
		font-weight: 400;
		font-size: 28rpx;
		color: #222222;
		text-align: right;
		margin: 0rpx 0rpx 0rpx 24rpx;
	}

	.personalInformation_fd1_2 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_2_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_2_c1 {
		font-size: 32rpx;
		font-weight: 400;
		color: #333;
		text-align: right;
		margin: 0rpx 0rpx 0rpx 24rpx;
	}

	.personalInformation_fd1_3 {
		border-bottom: 1px solid #eee;
		height: 109rpx;
	}

	.personalInformation_fd1_3_c0 {
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #333333;
	}

	.personalInformation_fd1_3_c1 {
		font-weight: 500;
		font-size: 28rpx;
		color: rgba(0, 0, 0, 0.8);
	}

	.personalInformation_flex_1 {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 24rpx 0rpx 24rpx;
		margin: 16rpx 24rpx 0;
	}

	.personalInformation_fd0_0 {
		padding: 0rpx 32rpx 0rpx 32rpx;
		height: 88rpx;
	}

	.personalInformation_fd0_0_c0_c0 {
		font-size: 32rpx;
		font-weight: 500;
		color: #fff;
	}

	.personalInformation_fd0_0_c1 {
		font-size: 32rpx;
		font-weight: bold;
		color: #fff;
	}

	.personalInformation_fd0_0_c2 {
		width: 36rpx;
		height: 36rpx;
	}

	.personalInformation_flex_0 {
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 10;
		top: 0rpx;
		background: url(https://speed.zhongchuxing.com/gjdimages/466.png) no-repeat;
		background-size: 100% auto !important;
	}

	.page {
		min-height: calc(100vh - var(--window-bottom));
		background: url(https://speed.zhongchuxing.com/gjdimages/466.png) no-repeat #f6f7fb;
		background-size: 100% auto !important;
	}
</style>